import { useUserInfoStore } from "@/stores/userInfo";
import type { App } from "vue";

const registerPermissionDirective = (app: App) => {
  const userInfoStore = useUserInfoStore();
  app.directive("permission", (el, binding) => {
    /*
      el 绑定事件的目标元素
      binding 对象，里面包含指令表达式
        binding.value 表达式的值

        例如：
          v-permission="'btn.User.add'"

          binding.value -> 'btn.User.add'
    */
    if (!userInfoStore.buttons.includes(binding.value)) {
      el.style.display = "none";
    }
  });
};

export default registerPermissionDirective;
